
#scroller {
	position: absolute;
	z-index: 1;
	height: 100%;
  	overflow: auto;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	width: 100%;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;

	/*内嵌样式*/
	transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); 
	-webkit-transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); 
	transition-duration: 0ms; 
	-webkit-transition-duration: 0ms; 
	transform: translate(0px, 0px) translateZ(0px);

	transition: top 2s;
	-moz-transition: top 2s;	/* Firefox 4 */
	-webkit-transition: top 2s;	/* Safari 和 Chrome */
	-o-transition: top 2s;	/* Opera */
}

#scroller-pullDown,#scroller-pullUp {
    background: #fff;
    height: 50px;
    line-height: 40px;
    padding: 5px 10px;
    /*border-bottom: 1px solid #ccc;*/
    font-weight: bold;
    font-size: 14px;
    color: #888;
	text-align:center;
	/*position:absolute;*/
	left:0px;
	width:100%;
}
#scroller-pullDown{
	/*top:-50px;*/
	/*display: none;*/
}
#scroller-pullUp{
	/*bottom:-50px;*/
}

#scroller-pullDown .pull-up-msg,#scroller-pullUp .pull-down-msg {
	padding-left:20px;
}

/*#scroller-pullDown .pull-down-icon,#scroller-pullUp .pull-up-icon{
	display:inline-block;
	color:#f00;
	font-size:3em;
	-webkit-transform:rotate(0deg);
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-duration: 500ms;
}*/
div#scroller-content {
  position: absolute;
  width: 100%;
  top: -50px;
}
#down-icon {
  background: url(../imgs/icon-arrow-down.png) center no-repeat;
  display: inline-block;
  width: 15px;
  /* margin-top: 5px; */
  height: 15px;
  background-size: 15px;
}
#up-icon{
	background: url(../imgs/icon-loading.png) center no-repeat;
	/*animation: myfirst 5s linear 2s infinite alternate;*/
	animation: loading 1s linear 0s infinite normal;
	-webkit-animation:loading 1s linear 0s infinite normal;
  display: inline-block;
  width: 15px;
  height: 15px;
  background-size: 15px;
}
#scroller-pullDown .reverse_icon{
  transform: rotate(180deg);
  -webkit-transform:rotate(180deg);
  transition:transform 0.3s;
  -webkit-transition:transform 0.3s;
 }
#scroller-pullDown .loading{
	background: url(../imgs/icon-loading.png) center no-repeat;
	background-size: 15px;
	/*animation: myfirst 5s linear 2s infinite alternate;*/
	animation: loading 1s linear 0s infinite normal;
	-webkit-animation:loading 1s linear 0s infinite normal;

}
/*加载图标的旋转*/
@keyframes loading{
	0% {transform:rotate(0deg);}
	100% {transform:rotate(180deg);}
}
@-webkit-keyframes loading{
	0% { transform:rotate(0deg);}
	100% {transform:rotate(180deg);}
}

/*#scroller-pullDown .pull-down-icon.reverse_icon,#scroller-pullUp .pull-up-icon.reverse_icon{
	-webkit-transform: rotate(-180deg);
}*/
#scroller ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 100%;
	text-align: left;
}

#scroller li {
  padding: 21px 10px;
  height: 1em;
  line-height: 1em;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #fff;
  background-color: #fafafa;
  font-size: 1em;
}
span#pullDown-msg, span#pullUp-msg {
  font-size: 1em;
}
